
<html>
<head>
    <title>打开小程序</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
    <script>
        window.onerror = e => {
            console.error(e)
            alert(e)
        }
    </script>

    <script>
        function docReady(fn) {
            if (document.readyState === 'complete' || document.readyState === 'interactive') {
                fn()
            } else {
                document.addEventListener('DOMContentLoaded', fn);
            }
        }

        docReady(async function() {
            var ua = navigator.userAgent.toLowerCase();
            var isWXWork = ua.match(/wxwork/i) == 'wxwork';
            var isWeixin = !isWXWork && ua.match(/MicroMessenger/i) == 'micromessenger';
            var isMobile = false;
            var isDesktop = false;
            if (navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|IEMobile)/i)) {
                isMobile = true;
            } else {
                isDesktop = true;
            }
            console.warn('ua', ua);
            console.warn(ua.match(/MicroMessenger/i) == 'micromessenger');
            var m = ua.match(/MicroMessenger/i);
            console.warn(m && m[0] === 'micromessenger');
            if (isDesktop) {
                // 在 pc 上则给提示引导到手机端打开
                var containerEl = document.getElementById('desktop-web-container');
                containerEl.classList.remove('hidden');
                containerEl.classList.add('full', 'desktop-web-container');
            } else {
                var containerEl = document.getElementById('public-web-container');
                containerEl.classList.remove('hidden');
                containerEl.classList.add('full', 'public-web-container');

                var buttonEl = document.getElementById('public-web-jump-button');
                var buttonLoadingEl = document.getElementById('public-web-jump-button-loading');
                try {
                    await openWeapp(() => {
                        buttonEl.classList.remove('weui-btn_loading');
                        buttonLoadingEl.classList.add('hidden');
                    });
                } catch (e) {
                    buttonEl.classList.remove('weui-btn_loading');
                    buttonLoadingEl.classList.add('hidden');
                    throw e;
                }
            }
        });

        async function openWeapp(onBeforeJump) {
            if (onBeforeJump) {
                onBeforeJump();
            }

            location.href = 'weixin://dl/business/?t=eDULVdyA7Bk';
        }
    </script>
    <style>
        /*移动端打开小程序按钮样式*/
        .public-web-container a {
            position: absolute;
            bottom: 40%;
        }
        .weui-btn_primary {
            background-color: #07c160;
        }
        .weui-btn {
            position: relative;
            display: block;
            width: 184px;
            padding: 8px 24px;
            box-sizing: border-box;
            font-weight: 700;
            font-size: 17px;
            text-align: center;
            text-decoration: none;
            color: #fff;
            line-height: 1.4;
            border-radius: 4px;
            overflow: hidden;
        }
        .hidden {
            display: none;
        }

        .full {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
        }

        .public-web-container {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .public-web-container p {
            position: absolute;
            top: 40%;
        }

        .public-web-container a {
            position: absolute;
            bottom: 40%;
        }

        .desktop-web-container {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .desktop-web-container p {
            position: absolute;
            top: 40%;
        }
    </style>
</head>
<body>
<div class="page full">
    <div id="public-web-container" class="hidden">
        <a id="public-web-jump-button" href="javascript:" class="weui-btn weui-btn_primary weui-btn_loading" onclick="openWeapp()">
            <span id="public-web-jump-button-loading" class="weui-primary-loading weui-primary-loading_transparent"><i class="weui-primary-loading__dot"></i></span>
            打开小程序
        </a>
    </div>

    <div id="desktop-web-container" class="hidden">
        <p class="">请在手机中打开网页链接</p>
    </div>
</div>
</body>
</html>
